<%-- 
    Document   : carreras
    Created on : 05-jun-2012, 9:46:57
    Author     : Administrador
--%>
<%@page import="com.javabeans.Facultad"%>
<%@page import="com.javabeans.Carrera"%>
<%@include file="../../../../controlSession.jsp" %>
<%@page contentType="text/html" pageEncoding="UTF-8"%>
<!DOCTYPE html>
<%
    int i = 0;
    List<Facultad> facultades = (List<Facultad>)request.getAttribute("facultades");
    List<Carrera> carreras = (List<Carrera>)request.getAttribute("carreras");
    List<Carrera> carrerasInactivos = (List<Carrera>)request.getAttribute("carrerasInactivos");
%>
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <title>SI-ESFM </title>
        <meta name="description" content="Derechos Reservados SI-ESFM." />
        <link rel="stylesheet" href="<%=s_path%>/css/styles.css" type="text/css" />
        <link rel="stylesheet" href="<%=s_path%>/css/menu/style.css" type="text/css" />
        <link rel="stylesheet" href="<%=s_path%>/css/themes/start/jquery-ui-1.8.20.custom.css" type="text/css" />
        <link rel="shortcut icon" href="<%=s_path%>/images/ico.png" type="image/png"/>
        
        <script type="text/javascript" src="<%=s_path%>/js/jquery-1.7.2.min.js"></script>
        <script type="text/javascript" src="<%=s_path%>/js/validate/jquery.validate.min.js"></script>
        <script type="text/javascript" src="<%=s_path%>/js/ui/minified/jquery.ui.core.min.js"></script>  <!--si o si cargar esto-->
        <script type="text/javascript" src="<%=s_path%>/js/ui/minified/jquery.ui.widget.min.js"></script>
        <script type="text/javascript" src="<%=s_path%>/js/ui/minified/jquery.ui.position.min.js"></script>
        <script type="text/javascript" src="<%=s_path%>/js/ui/minified/jquery.ui.mouse.min.js"></script>
        <script type="text/javascript" src="<%=s_path%>/js/ui/minified/jquery.ui.button.min.js"></script>
        <script type="text/javascript" src="<%=s_path%>/js/ui/minified/jquery.ui.draggable.min.js"></script>
        <script type="text/javascript" src="<%=s_path%>/js/ui/minified/jquery.ui.resizable.min.js"></script>
        <script type="text/javascript" src="<%=s_path%>/js/ui/minified/jquery.ui.dialog.min.js"></script>
        <script type="text/javascript" src="<%=s_path%>/js/ui/minified/jquery.effects.core.min.js"></script>
        
        <script type="text/javascript" src="<%=s_path%>/js/comun.js"></script>
        <script type="text/javascript">
            
            <%
                out.println(" facultades = new Array();");
                for(Facultad f : facultades){
                    out.println(" facultades["+i+"] = new Array("+f.getIdFacultad()+",'"+f.getNombre()+"')");
                    i++;
                }
            %>
            
            $(document).ready(function(){
                $("#dialogo").dialog({
                    autoOpen: false,
                    title: "Formulario Especialidad",
                    height: 300,
                    width: 550,
                    modal: true,
                    buttons: {
                        "Aceptar": function() {
                            var flag = $("#formCarrera").valid();
                            if(flag){
                                $.ajax({
                                    type: 'POST',
                                    url: 'Administracion',
                                    data: $('#formCarrera').serialize(),
                                    success: function(res){
                                        $('#listCarreras').html(res);
                                    },
                                    error:function(){alert("Error! al registrar la Especialidad.")}
                                });
                                $( this ).dialog( "close" );
                            }
                        },
                        Cancelar: function() {
                            $( this ).dialog( "close" );
                        }
                    },
                    close: function() {
                        // implementar lo que convenga
                    }
		});
                
               // boton add departamento
               $.fn.addCarrera = function(){
                    $('#formCarrera').each(function(){
                        this.reset();
                    });
                    cargarFacultades();
                    $("#idFacultad2").removeAttr("disabled");
                    
                    $("#dia option").each(function(){
                        if($(this).attr('value') == ""){
                            $(this).attr('selected','true');
                        }
                    });
                    $("#mes option").each(function(){
                        if($(this).attr('value') == ""){
                            $(this).attr('selected','true');
                        }
                    });
                    $("#year option").each(function(){
                        if($(this).attr('value') == ""){
                            $(this).attr('selected','true');
                        }
                    });
                    
                    $("#titleForm").text("Nueva Especialidad");
                    $("#accion").val("90");
                    $( "#dialog:ui-dialog" ).dialog( "destroy" );
                    $( "#dialogo" ).dialog( "open" );
                    $("#idFacultad2").focus();
               }
               
               // modificar facultad
                $.fn.editar = function(idFacultad,idCarrera,nombre){
                    $("#titleForm").text("Modificar Especialidad");
                    $("#accion").val("91");
                    $("#idFacultad").val(idFacultad);
                    $("#idCarrera").val(idCarrera);
                    
                    $("#idFacultad2").html("<option value=''>Seleccione</option><option selected='true'>"+$("#nombreFacultad"+idCarrera).val()+"</option>");
                    $("#idFacultad2").attr("disabled","true");
                    $("#nombre").val(nombre);
                    $("#sigla").val($("#sigla"+idCarrera).val());
                    fecha = $("#fecha"+idCarrera).val().split("/");
                    $("#dia option").each(function(){
                        if($(this).attr('value') == fecha[0])
                            $(this).attr('selected','true');
                    });
                    $("#mes option").each(function(){
                        if($(this).attr('value') == fecha[1])
                            $(this).attr('selected','true');
                    });
                    $("#year option").each(function(){
                        if($(this).attr('value') == fecha[2])
                            $(this).attr('selected','true');
                    });
                    
                    $( "#dialog:ui-dialog" ).dialog( "destroy" );
                    $("#dialogo").dialog("open");
                }
               
                // eliminar Unidad Académica
                $.fn.eliminar = function(idCarrera,nombre){
                    if(confirm("¿Esta seguro de eliminar la especialidad ''"+nombre+"''?")){
                        $.ajax({
                            url: "Administracion",
                            type: "GET",
                            data:{ accion:92 , idCarrera:idCarrera, nombre:nombre },
                            success:function(res){
                                $('#listCarreras').html(res);
                            },
                            error: function(res){ alert("Error! al eliminar la Especialidad."); }
                        });
                    }
                }
                
                // baja facultad
                $.fn.darBaja = function(idCarrera,nombre){
                    if(confirm("Estas seguro de dar baja la especialidad''"+nombre+"'', con sus dependencias de materias?")){
                        $.ajax({
                            url: "Administracion",
                            type: "GET",
                            data:{ accion:93, idCarrera:idCarrera, nombre:nombre },
                            success:function(res){
                                $('#listCarreras').html(res);
                            },
                            error: function(res){ alert("Error! al dar de baja la especialidad."); }
                        });
                    }
                }
                
                // alta unidad academica
                $.fn.darAlta = function(idCarrera,nombre){
                    if(confirm("Esta seguro de dar de Alta la Especialidad ''"+nombre+"'', con sus respectivos dependencias de materias?")){
                        $.ajax({
                            url: "Administracion",
                            type: "GET",
                            data:{ accion:94 , idCarrera:idCarrera, nombre:nombre },
                            success:function(res){
                                $('#listCarreras').html(res);
                            },
                            error: function(res){ alert("Error! al dar de alta la especialidad."); }
                        });
                    }
                }
                
                $.fn.verPensum = function(idCarrera,nombre){
                    location.href = "Administracion?accion=102&idCarrera="+idCarrera;
                }
                
                $("#idFacultad2").change(function(){ // si cambia de Unidad Académica tambien cambiamos en la variable auxiliar
                    $("#idFacultad2 option:selected").each(function (){
                        $("#idFacultad").val($(this).val());
                    });
                });
            });
            
            function cargarFacultades(){
                var lista = document.getElementById("idFacultad2");
                var j = 2;
                var k = 1;
                lista.selectedIndex = 0;
                for(i = 0; i<facultades.length; i++){
                    lista.length = j;
                    lista.options[k].value = facultades[i][0];
                    lista.options[k].text = facultades[i][1];
                    k++;
                    j++;
                }
                if(j == 2)
                    lista.length = 1;
            }
            
            // muestra oculta
            function mostrarOcultar(){
                if(document.getElementById("carrerasBaja").style.display == 'none'){
                    document.getElementById("carrerasBaja").style.display = 'block';
                    document.getElementById("verOcultar").value = "Ocultar Bajas";
                    document.getElementById("verOcultar").title="Pulsa aqui para ocultar bajas";
                }else{
                    document.getElementById("carrerasBaja").style.display = 'none';
                    document.getElementById("verOcultar").value = "Mostrar Bajas"
                    document.getElementById("verOcultar").title="Pulsa aqui para mostrar bajas";
                }
            }
            
        </script>
    </head>
    <body onload="showTime(<%=s_param%>)">
        <div id="top-wrap">
            <!-- cabeza principal -->
            <%@include file="../../../../head.jsp" %>

            <!-- cuerpo -->
            <div id="bodySpace">               
                <!-- aqui va la ruta -->
                <div class="clearfix" id="middle">
                    <!-- aqui va el arbol de entrada -->
                    <div id="breadcrumb"><!-- le da la forma de la imagen -->
                        <ul>
                            <li><a>Home</a></li>
                            <li><span style="color:#666">Administraci&oacute;n</span></li>
                            <li><span style="color:#666">Administraci&oacute;n Acad&eacute;mico</span></li>
                            <li class="current-page"><span class="end"><span class="middle">Especialidades</span></span></li>
                        </ul>
                        <!-- para la hora -->
                        <div style="clear: both;position: absolute;text-align: right;width: 100%;"><span id="fechaServ"></span>&nbsp;&nbsp;<span id="horaServ" style=""></span>&nbsp;</div>
                    </div><!-- begin SIDEBAR FIRST -->
                </div>
                
                <div id="principal">
                    
                    <!-- izquierda -->
                    <div class="cuerpo2" style="border: 0px solid">
                        <div class="izq" style="border: 0px solid">
                            <%@include file="../../../../bodyIzq.jsp" %>
                        </div>
                        <div class="der" style="border: 0px solid"> 
                            <center>
                            <div id="listCarreras">
                                
                                <h2 class="decorado">Lista de Especialidades por Unidad Acad&eacute;mica</h2>
                            <table class="miReporte" style="width: 100%">
                                <tr>
                                    <td style="text-align: right"><input type="button" class="boton" value="A&ntilde;adir Nueva Especialidad" onclick="$.fn.addCarrera()"/></td>
                                </tr>
                            </table>
                            <table class="tabla_decorado" style="width: 100%">
                                <thead>
                                    <tr><!--  -->
                                        <th width="5%" class="th_decoradoRowspan">Nro</th>
                                        <th width="25%" class="th_decoradoRowspan">UNIDAD ACAD&Eacute;MICA</th>
                                        <th width="30%" class="th_decoradoRowspan">ESPECIALIDAD</th>
                                        <th width="10%" class="th_decoradoRowspan">SIGLA ESPECIALIDAD</th>
                                        <th width="5%" class="th_decoradoRowspan">FECHA CREACION</th>
                                        <th width="25%" class="th_decoradoRowspan" colspan="4">ACCIONES</th>
                                    </tr>
                                </thead>
                                <tbody>
                            <%
                                i = 1;
                                for(Carrera c : carreras){
                            %>          
                                    <tr class="tr_decorado">
                                        <td class="th_decorado" style="text-align: center"><%=i%></td>
                                        <td class="th_decorado"><%=c.getFacultad().getNombre()%></td>
                                        <td class="th_decorado"><%=c.getNombre()%></td>
                                        <td class="th_decorado"><%=c.getSigla()%></td>
                                        <td class="th_decorado"><%=c.getFecha()%></td>
                                        <td class="td_decoradoDerecha" style="text-align: center">
                                            <input type="button" value="Pensum" onclick="$.fn.verPensum(<%=c.getIdCarrera()%>,'<%=c.getNombre()%>')" class="botonRep" title="Pulsa aqui para ver pensum."/>
                                        </td>
                                        <td class="td_decoradoDerecha" style="text-align: center">
                                            <input type="button" value="Editar" onclick="$.fn.editar(<%=c.getIdFacultad()%>,<%=c.getIdCarrera()%>,'<%=c.getNombre()%>')" class="botonRep" title="Pulsa aqui para modificar la especialidad"/>
                                        </td>
                                        <td class="td_decoradoDerecha" style="text-align: center">
                                            <input type="button" value="Dar Baja" onClick="$.fn.darBaja(<%=c.getIdCarrera()%>,'<%=c.getNombre()%>')" class="botonRep" title="Pulsa aqui para dar de baja la especialidad"/>
                                        </td>
                                        <td class="td_decoradoDerecha" style="text-align: center">
                                            <input type="button" value="Eliminar" onClick="$.fn.eliminar(<%=c.getIdCarrera()%>,'<%=c.getNombre()%>')" class="botonRep" title="Pulsa aqui para eliminar la especialidad"/>
                                        </td>
                                    </tr>
                                    <input type="hidden" name="sigla<%=c.getIdCarrera()%>" id="sigla<%=c.getIdCarrera()%>" value="<%=c.getSigla()%>" />
                                    <input type="hidden" name="fecha<%=c.getIdCarrera()%>" id="fecha<%=c.getIdCarrera()%>" value="<%=c.getFecha()%>" />
                                    <input type="hidden" name="nombreFacultad<%=c.getIdCarrera()%>" id="nombreFacultad<%=c.getIdCarrera()%>" value="<%=c.getFacultad().getNombre()%>" />
                            <%      i++;
                                }
                                if(i == 1){
                                    out.write("<tr class='tr_decorado'>");
                                    out.write("     <td class='td_decorado' colspan='8' style='text-align:center'><span style='color:red'>No existen especialidades registradas!</span></td>");
                                    out.write("</tr>");
                                }
                            %>
                                </tbody>
                            </table>
                            <!-- boton que muestra y oculta las unidades academicas dados de baja -->    
                            <table class="miReporte" style="width: 100%">
                                <tr>
                                    <td style="text-align: right"><input type="button" name="verOcultar" id="verOcultar" value="Mostrar Bajas" onclick="mostrarOcultar()" class="boton" title="Pulsa aqui para mostrar bajas"/></td>
                                </tr>
                            </table>      <br/><br/>
                                
                            <!-- para mostrar bajas -->
                            <div id="carrerasBaja" style="display:none;">
                                <center>
                                <h2 class="decorado">Especialidades dados de Baja</h2>
                                <table class="tabla_decorado" style="width: 100%">
                                    <thead>
                                        <tr><!--  -->
                                            <th width="5%" class="th_decoradoRowspan">Nro</th>
                                            <th width="30%" class="th_decoradoRowspan">UNIDAD ACAD&Eacute;MICA</th>
                                            <th width="30%" class="th_decoradoRowspan">ESPECIALIDAD</th>
                                            <th width="15%" class="th_decoradoRowspan">SIGLA ESPECIALIDAD</th>
                                            <th width="10%" class="th_decoradoRowspan">FECHA CREACION</th>
                                            <th width="10%" class="th_decoradoRowspan">ACCIONES</th>
                                        </tr>
                                    </thead>
                                    <tbody>
                                <%
                                    i = 1;
                                    for(Carrera c : carrerasInactivos){
                                %>          
                                        <tr class="tr_decorado">
                                            <td class="th_decorado" style="text-align: center"><%=i%></td>
                                            <td class="th_decorado"><%=c.getFacultad().getNombre()%></td>
                                            <td class="th_decorado"><%=c.getNombre()%></td>
                                            <td class="th_decorado"><%=c.getSigla()%></td>
                                            <td class="th_decorado"><%=c.getFecha()%></td>
                                            <td class="td_decoradoDerecha" style="text-align: center">
                                                <input type="button" value="Dar Alta" onClick="$.fn.darAlta(<%=c.getIdCarrera()%>,'<%=c.getNombre()%>')" class="botonRep" title="Pulsa aqui para dar de alta la especialidad. <%=c.getNombre()%>"/>
                                            </td>
                                        </tr>
                                <%      i++;
                                    }
                                    if(i == 1){
                                        out.write("<tr class='tr_decorado'>");
                                        out.write("     <td class='td_decorado' colspan='6' style='text-align:center'><span style='color:red'>No existen especialidades dados de baja!<span></td>");
                                        out.write("</tr>");
                                    }
                                %>
                                    </tbody>
                                </table>
                                </center>
                            </div> <!-- End pais id='paisBaja' -->
                            
                            </div> <!-- End id="listPais" -->
                                
                            <div id="dialogo"><br/>
                                <h2 class="decorado" id="titleForm"></h2><br/>
                                <form id="formCarrera">
                                    <input type="hidden" name="accion" id="accion" value="0" />
                                    <input type="hidden" name="idFacultad" id="idFacultad" value="0" />
                                    <input type="hidden" name="idCarrera" id="idCarrera" value="0" />                                    
                                    <div style="clear:both;">
                                        <label class="form_align30">Unidad Acad&eacute;mica: </label>
                                        <select name="idFacultad2" id="idFacultad2" class="required form_input_align" title="Seleccione una Unidad Acad&eacute;mica!">
                                            <option value="">Seleccione</option>
                                        </select>
                                    </div>
                                    <div style="clear:both;">
                                        <label class="form_align30" >Nombre: </label>
                                        <input type="text" name="nombre" id="nombre" value="" class="required form_input_align" title="Ingrese Nombre de la especialidad" maxlength="40"/>
                                        <label class="error">*</label>
                                    </div>
                                    <div style="clear:both;">
                                        <label class="form_align30" >Sigla: </label>
                                        <input type="text" name="sigla" id="sigla" value="" class="required form_input_align" title="Ingrese Sigla de la especialidad" maxlength="10"/>
                                        <label class="error">*</label>
                                    </div>
                                    <div style="clear:both;">
                                        <label class="form_align30">Fecha Creaci&oacute;n: </label>
                                        <select name="dia" id="dia" class="form_input_align required" title="Seleccione d&iacute;a." >
                                            <option value="">D&iacute;a</option>
                                            <%
                                                for(i=1; i<32; i++)
                                                    out.println("<option value='"+((i<10)?"0"+i:i)+"'>"+i+"</option>");
                                            %>
                                        </select>
                                        <select name="mes" id="mes" class="form_input_align required" title="Seleccione mes." >
                                            <option value="">Mes</option>
                                            <%
                                            for(i=1; i<13; i++){
                                                String mes = "";
                                                switch(i){
                                                    case 1 : mes = "Enero"; break;
                                                    case 2 : mes = "Febrero"; break;
                                                    case 3 : mes = "Marzo"; break;
                                                    case 4 : mes = "Abril"; break;
                                                    case 5 : mes = "Mayo"; break;
                                                    case 6 : mes = "Junio"; break;
                                                    case 7 : mes = "Julio"; break;
                                                    case 8 : mes = "Agosto"; break;
                                                    case 9 : mes = "Septiembre"; break;
                                                    case 10 : mes = "Octubre"; break;
                                                    case 11 : mes = "Noviembre"; break;
                                                    default : mes = "Diciembre";
                                                }
                                                out.println("<option value='"+((i<10)?"0"+i:i)+"'>"+mes+"</option>");
                                            }
                                            %>
                                        </select>
                                        <select name="year" id="year" class="form_input_align required" title="Seleccione a&ntilde;o." >
                                            <option value="">A&ntilde;o</option>
                                            <% 
                                                Calendar fechaActual = Calendar.getInstance();
                                                for(int year = fechaActual.get(Calendar.YEAR); year > 1929; year --)
                                                    out.println("<option value='"+year+"'>&nbsp;"+year+"&nbsp;</option>");
                                            %>
                                        </select>
                                        <label class="error">*</label>
                                    </div>
                                </form>
                            </div> <!-- FIN DIV id="dialogo" -->
                            
                            </center>
                            
                        </div> <!-- class='der' -->
                    </div><!--end of leftPan-->
                    
                </div><!--end of content-wrapper-->
            </div><!--end of body-wrap-->
            
            <!-- footer -->

        </div>
    </body>
</html>